﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>ContainerSliderContainer Test</title>
    
    <link href="ContainerSlider.css" rel="stylesheet" type="text/css" />
    
    <script src="../Common/IndustrialDashboard.js" type="text/javascript"></script>
    <script src="../Common/Common.js" type="text/javascript"></script>
    <script src="../Common/ParseAttributes.js" type="text/javascript"></script>
    <script src="Transition.js" type="text/javascript"></script>
    <script src="ContainerSlider.js" type="text/javascript"></script>

    <style type="text/css">
        
        .ContentItem {
        	position:relative;
        	margin:0;
        	margin-top:10px;
        	padding:0;
        	left:0;
        	top:0;
        	height:50px;
        	width:100%;
        	background-color:#FF0000;
        	display:inline-block;
        }
        
    </style>

    <script language="javascript" type="text/javascript">
        var WREF = {};
        WREF.ContainerSliderCS = null;

        attachDomReadyEventHandler(function () {
            WREF.ContainerSliderCS = new ContainerSlider(
                document.getElementById("ContainerSliderContainer")
                , { Events: { Error: [Common.ShowError] } }
            );

            var content = document.createElement("div")
            content.style.backgroundColor = "#00FF00";
            content.className = "ContentItem";
            WREF.ContainerSliderCS.AddContent(content);

            for(var i = 0; i < 100; i++)
            {
                var content = document.createElement("div");
                content.className = "ContentItem";
                content.innerHTML = i;

                WREF.ContainerSliderCS.AddContent(content);
            }

            var content = document.createElement("div")
            content.style.backgroundColor = "#00FF00";
            content.className = "ContentItem";
            WREF.ContainerSliderCS.AddContent(content);
        });

    </script>
</head>

<body style="position:fixed;height:100%;width:100%;text-align:center;">
    <div id="ContainerSliderContainer" style="position:relative;height:100%;width:50%;border:1px solid #000000;"></div>
    <!--<div id="Log" style="position: absolute;left: 60%;width:10%;height:100%;display:inline-block;"></div>
    <div id="Log2" style="position: absolute;left: 80%;width:10%;height:100%;display:inline-block;"></div>-->
</body>

</html>